<template>
  <div>
    <home-header ></home-header>
    <home-swiper :swiperList="swiperList"></home-swiper>
    <home-icon :iconList="iconList"></home-icon>
    <home-commends :commendList="commendList"></home-commends>
    <home-weekends :weekendList="weekendList"></home-weekends>
  </div>
</template>
<script>
import homeHeader from './components/homeHeader'
import homeSwiper from './components/swiper'
import homeIcon from './components/homeIcon'
import homeCommends from './components/homeCommends'
import homeWeekends from './components/homeWeekends'
import { mapState } from 'vuex'
import axios from 'axios'
export default{
  name: 'Home',
  components: {
   	homeHeader,
   	homeSwiper,
   	homeIcon,
   	homeCommends,
   	homeWeekends
  },
  data () {
  	return {
  		swiperList:[],
  		iconList:[],
  		commendList:[],
  		weekendList:[],
  		lastCity:''
  	}
  },
  methods:{
  	getHomeInfo () {
  		axios.get('/api/index.json?city='+this.$store.state.city)
  			.then(this.getHomeInfoSucc)
  	},
  	getHomeInfoSucc (res) {
  		res=res.data
  		if(res.ret&&res.data){
  			const data=res.data
  			this.city=data.city
  			this.swiperList=data.swiperList
  			this.iconList=data.iconList
  			this.commendList=data.commendList
  			this.weekendList=data.weekendList
  		}
  	}
  },
  mounted () {
  	this.lastCity=this.city
  	this.getHomeInfo()
  },
  //使用keep-ative 后 多一个生命周期函数 activated 页面重新显示时调用
  activated () {
  	if(this.lastCity!==this.city){
  		this.lastCity=this.city
  		this.getHomeInfo()
  	}
  }
}
</script>
<style scoped>
</style>
